// 轮播图
(function () {
    var index = 0
    var timer = setInterval(() => {
        $('.banner-img>img').eq(index).fadeOut(500, 'linear')
        // $('.banner-dot>span').eq(index).removeClass('st')
        index == 4 ? index = 0 : index++;
        $('.banner-img>img').eq(index).fadeIn(500, 'linear')
        $('.banner-dot>span').eq(index).addClass('st').siblings()
            .removeClass('st')
    }, 5000)

    $('.banner-dot>span').click(function () {
        clearInterval(timer)
        $('.banner-img>img').eq(index).fadeOut(500, 'linear')
        index = $(this).index();
        $('.banner-img>img').eq(index).fadeIn(500, 'linear')
        timer = setInterval(() => {
            $('.banner-img>img').eq(index).fadeOut(500, 'linear')
            // $('.banner-dot>span').eq(index).removeClass('st')
            index == 4 ? index = 0 : index++;
            $('.banner-img>img').eq(index).fadeIn(500, 'linear')
            $('.banner-dot>span').eq(index).addClass('st').siblings()
                .removeClass('st')
        }, 6000)
        $('.banner-dot>span').eq(index).addClass('st').siblings()
            .removeClass('st')

    })
})()
// ajax异步请求数据小标题
$.ajax({
    url: './php/banner1.php',
    type: 'GET',
    dataType: 'json',
    success: function (data) {
        // console.log(data);
        // var index = 0;
        for (const sj of data) {
            // console.log(sj.type);

            var li = $('<li></li>')
            var a = $("<a></a>")
            // console.log(a);
            a.prop('href', './detail.html')
                .css('backgroundImage', `url(${sj.imgUrl})`)
                .html(`${sj.name}`)
            li.append(a)
            $('.ajax-li>ul>li').eq(sj.type).find('.ajax-one')
                .append(li)
            // console.log($('.ajax-li>lu>li'));
            // index++;
        }
    }
})
// ajax请求列表主体
$.ajax({
    url: './php/banner2.php',
    type: 'GET',
    dataType: 'json',
    success: function (data) {
        for (const sj of data) {
            var li = $('<li></li>')
            var i = $('<i></i>')
            var a = $('<a href="./detail.html"></a>')
            if (sj.label == 1) {
                i.css('background-image', 'url(./img/tj.png)');
            } else if (sj.label == 2) {
                i.css('background-image', 'url(./img/rl.png)')
            } else if (sj.label == 3) {
                i.css('background-image', 'url(./img/qg.png)')
            }
            a.html(`<img src="${sj.imgUrl}" alt=""><span>${sj.name}</span>`)
            li.append(i).append(a)
            $('.ajax-li>ul>li').eq(sj.type).find('.ajax-two')
                .append(li)
        }
    }
})

// ajax请求秒杀数据
// https://shop.vivo.com.cn/api/v1/channel/getDetail?t=1631846229219
mssj()

function mssj() {
    $.ajax({
        url: './php/ms.php',
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            if (toString.call(data) == '[object Array]') {
                console.log(2);
            } else if (toString.call(data) == '[object Object]') {
                // console.log(1);
                // console.log(data['actSkuInfoVos']);
                djs(data['timeVo']['currentTime'], data['timeVo']['endTime'])

                for (let sj of data['actSkuInfoVos']) {
                    var div = $('<div></div>')
                    div.append(`<img class="con-img" src="${sj['cornerImg']}" alt="">`)
                        .append(`
                    <a href="./detail.html"><img class="t-img" src="${sj['skuImg']}" alt=""></a>
                    `)
                        .append(`<p class="con-name">${sj['skuName']}</p>`)
                        .append(` <p class="con-desc">${sj['promotion']}</p>`)
                        .append(`
                    <p class="con-price">
                            <span>
                                <em>￥</em>
                                ${sj['actPrice']}
                            </span>
                            <span class="del">
                                <em>￥</em>
                                ${sj['marketPrice']}
                            </span>
                        </p>
                    `)
                    $('.con').append(div)
                    all++;
                }
                index = parseInt(all/4)
                var lastdiv = $('<div></div>')
                lastdiv.append(`
                        <h4>下一场</h4>
                        <p>${data['timeVo']['nexStartTime']}</p>
                        <a href="#">去看看</a>
                `)
                .addClass('last-div')
                $('.con').append(lastdiv)
            }

        }
    })
}
var timer
// 设置秒杀倒计时
function djs(currentTime, endTimer) {
    if((currentTime-0)>=(endTimer-0)){
        clearInterval(timer)
        mssj()
    }else{
        timer = setInterval(() => {
            var t = parseInt((endTimer - currentTime) / 1000);
            var s = parseInt(t / 3600 % 24) + ''
            var f = parseInt(t / 60 % 60) + ''
            var m = parseInt(t % 60) + ''
            if (s.length == 1) {
                $('.shi').html(`0${s}`)
            } else {
                $('.shi').html(s)
            }
            if (f.length == 1) {
                $('.fen').html(`0${f}`)
            } else {
                $('.fen').html(f)
            }
            if (m.length == 1) {
                $('.miao').html(`0${m}`)
            } else {
                $('.miao').html(m)
            }
            currentTime = currentTime / 1 + 1000;
        }, 1000)
    }
}
var all=1;
var index = 0
// 秒杀切换
$('.bto-left').click(function(){
    var hot = all%4;
    if(parseInt($('.con').css('left'))<((-all+4+hot)*300)){
        $('.con').stop().animate({
            left:(parseInt($('.con').css('left'))+hot*300)
        },hot*70,'linear')
    }else{
        if(index<parseInt(all/4)){   
            $('.con').stop().animate({
                left:(parseInt($('.con').css('left'))+4*300)
            },225,'linear')
            
            index++;
        }
    }
    
})
$('.bto-right').click(function(){
    var hot = all%4;
    console.log(all);
    console.log((-all+4+hot)*300);
    console.log(parseInt($('.con').css('left')));
    if(parseInt($('.con').css('left'))>((-all+4+hot)*300)){
        if(index>0){   
            $('.con').stop().animate({
                left:(parseInt($('.con').css('left'))-4*300)
            },225,'linear')
            index--;
        }
    }else if(parseInt($('.con').css('left'))==((-all+4+hot)*300)){
        $('.con').stop().animate({
            left:(parseInt($('.con').css('left'))-hot*300)
        },hot*70,'linear')
    }
})